<template>
  <div>
    <h4>这个是父组件</h4>
    <p>这个是父组件中的num：{{ num }}----{{ num2 }}</p>

    <hr>

    <!-- <son
      :aa="num"
      :bb="num2"
      @update:aa="val=>num = val"
      @update:bb="val=>num2 = val"
    /> -->
    <!-- 语法糖的写法 xxx.sync -->
    <!-- xx.sync可以实现父子组件数据的双向绑定
        - 和v-model区别 ：
           v-model只能绑定一次， xx.sync可以绑定多次
     -->
    <son :aa.sync="num" :bb.sync="num2" />
  </div>
</template>

<script>
import Son from './Son.vue'
export default {
  components: {
    Son
  },
  data() {
    return {
      num: 100,
      num2: 200

    }
  },
  methods: {

  }
}
</script>

<style>

</style>
